<template>
	<view class="repair-wrap">
		<view style="padding: 0 20rpx;" v-for="(item,index) in repairList" :key='index'>
			<view @click="toDetails(item.id)" 
				class="u-m-t-20 repair-box u-p-40 u-p-l-30 u-p-r-30 rounded-2 shadow">
				<view class="repair-titel u-m-b-40">
					<view class="repair-titel-l u-font-32" style="display: flex;">
						<image style="width: 20px;height: 20px;" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/ownerImage/repairList.png"></image>
						<h3 style="margin-left: 6px;">{{item.subjectName}}</h3>
					</view>
					<view class="repair-titel-r u-font-28">
						{{item.repairsStatus==1?'待接单':item.repairsStatus==2?'待派单':item.repairsStatus==3?'已派单':item.repairsStatus==4?'员工已接单':item.repairsStatus==5?'员工拒绝接单':item.repairsStatus==11?'已撤单':item.repairsStatus==12?'维修中':item.repairsStatus==13?'已支付':item.repairsStatus==14?'物业费结清免单':item.repairsStatus==8?'待支付':''}}
					</view>
				</view>
				<view class="u-m-b-20 u-font-28 repair-6">
					报修工单：{{item.repairsCode}}
				</view>
				<view class="u-m-b-20 u-font-28 repair-6">
					报修时间：{{item.repairsAppointmentStartTime}}~{{item.repairsAppointmentEndTime.slice(11)}}
				</view>
			</view>
		</view>
		<view v-if='repairList.length == 0'>
			<view style="width: 232px;height: 242px;margin: 110px auto;">
				<image style="width: 100%;height: 100%;" src="https://clhy-img.oss-cn-beijing.aliyuncs.com/xcxImage/2023-08-05/de8bed00f080ef234244740548dd040.png"
					mode=""></image>
			</view>
			<view style="width: 62%;margin: -66px auto;text-align: center;color: #999;">暂无数据</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				repairList: [],
				homelist: {},
			}
		},
		onShow() {
			this.checkLogin()
		},
		onPullDownRefresh() {
			this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
			this.getList()
		},
		methods: {
			// 验证是否登录或实名认证
			checkLogin() {
				let _this = this
				if (uni.getStorageSync('phone')) {
					if (uni.getStorageSync('loginFlag')) {
						if (!uni.getStorageSync('hourseList')) {
							uni.showModal({
								title: '请先进行业主认证',
								showCancel: false,
								confirmText: '确认',
								confirmColor: '#F9A832',
								success: function(res) {
									if (res.confirm) {
										_this.$Router.push({
											path: '/my/address/address'
										})
									}
								}
							});
							this.$openInvite()
						} else {
							_this.showFlag = true
							_this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
							_this.name = _this.homelist.proName;
							_this.address = _this.homelist.buildDistrictCode + '-' + _this.homelist.buildTowerCode + '-' +
								_this.homelist.roomUnitNumber + '-' + _this.homelist.roomCode

							this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
							this.getList()
						}
					} else {
						uni.showModal({
							title: '请先实名认证',
							showCancel: false,
							confirmText: '确认',
							confirmColor: '#F9A832',
							success: function(res) {
								if (res.confirm) {
									_this.$Router.push({
										path: '/homePage1/realName/realName'
									})
								}
							}
						});
					}
				} else {
					uni.showModal({
						title: '请先登录',
						showCancel: false,
						confirmText: '确认',
						confirmColor: '#F9A832',
						success: function(res) {
							if (res.confirm) {
								console.log('a')
								_this.$Router.pushTab({
									path: '/pages/user/user'
								})
							}
						}
					});
				}
				uni.stopPullDownRefresh()

			},
			toDetails(val) {
				this.$Router.push({
					path: '/homePage1/repairDetails/repairDetails',
					query: {
						id: val
					}
				})
			},
			// 获取列表
			getList() {
				uni.showLoading({
					title: '加载中'
				})
				console.log(this.homelist.roomId)
				this.$request.api.repairList({
					repairs_status:'8,11',
					room_id: this.homelist.roomId,
				}).then(res => {
					this.repairList = res.data.data.list
					console.log(res)
					uni.hideLoading()
					uni.stopPullDownRefresh();
				})

			},
		}
	}
</script>

<style lang="scss">
	.repair-wrap {
		width: 100%;
		min-height: 100vh;
		height: auto;
		background: #f4f4f4;
		overflow: hidden;

		.repair-box {
			background: #fff;

			.repair-titel {
				height: 44rpx;
				line-height: 44rpx;

				.repair-titel-l {
					float: left;
				}

				.repair-titel-r {
					float: right;
					color: #999;
				}
			}

			.repair-6 {
				color: #666;
			}
		}
	}
</style>